<template>
  <Item
    v-for="item of todoList"
    :key="item.id"
    :item="item"
    @removeTodo="RemoveTodo"
    @setStatus="SetStatus"
    @setDoing="SetDoing"
  />
</template>

<script lang='ts'>
import { defineComponent, PropType } from "vue";
import Item from "@/components/TodoList/item.vue";
import { ITodoItem } from "@/typings";
import { TodoManager } from "@/hooks/TodoManage";
export default defineComponent({
  name: "App",
  props: {
    todoList: Array as PropType<ITodoItem[]>,
  },
  components: { Item },
  setup() {
    const { RemoveTodo, SetStatus, SetDoing } = TodoManager();
    return {
      RemoveTodo,
      SetStatus,
      SetDoing,
    };
  },
});
</script>

<style scoped>
</style>